import React, { useEffect, useState } from 'react'
import { useLocation, useNavigate } from 'react-router-dom'
import { Card, Descriptions, Button } from 'antd'
import { reqHospitalDetail } from '@api/user/hospital/hospitalList'
import { IhospitalDetailResponse } from '@api/user/hospital/model/hospitalListTypes'
import { ButtonType } from 'antd/lib/button'


export default function HospitalShow(){
  const navigate = useNavigate()
  const location = useLocation()
  //   console.log(location.state)
  const [hospital, setHospital] = useState<IhospitalDetailResponse>({
    bookingRule: {
      cycle: 10,
      releaseTime: '08:30',
      stopTime: '11:30',
      quitDay: -1,
      quitTime: '15:30',
      rule: [
        '西院区预约号取号地点：西院区门诊楼一层大厅挂号窗口取号',
        '东院区预约号取号地点：东院区老门诊楼一层大厅挂号窗口或新门诊楼各楼层挂号/收费窗口取号',
      ],
    },
    hospital: {
      id: '622574cc36a9ba1be763dad8',
      createTime: '2022-03-07 10:58:20',
      updateTime: '2022-07-13 14:01:10',
      isDeleted: 0,
      param: {
        hostypeString: '三级甲等',
        fullAddress: '北京市市辖区西城区大望路',
      },
      hoscode: '1000_0',
      hosname: '北京协和医院',
      hostype: '1',
      provinceCode: '110000',
      cityCode: '110100',
      districtCode: '110102',
      address: '大望路',
      logoData: '',
      intro: '',
      route: '',
      status: 0,
      bookingRule: null,
    },
  })
  useEffect(() => {
    async function fetch() {
      // location.state就是医院的id
      const result = await reqHospitalDetail(location.state as string)
      console.log(result)
      setHospital(result)
    }
    fetch()
  }, [])

  return (
    <Card> <Descriptions title="基本信息" bordered column={2}>
    <Descriptions.Item label="医院名称"> {hospital.hospital.hosname}</Descriptions.Item>
    <Descriptions.Item label="医院logo">
      <img width="150"   src={'data:image/png;base64,' + hospital.hospital.logoData} alt="img" />
      
    </Descriptions.Item>
    <Descriptions.Item label="医院编码"> {hospital.hospital.hoscode}</Descriptions.Item>
    <Descriptions.Item label="医院地址">{hospital.hospital.param.fullAddress}</Descriptions.Item>
    <Descriptions.Item label="乘车路线" span={2} >{hospital.hospital.route}</Descriptions.Item  >
    <Descriptions.Item label="医院简介" span={2}>{hospital.hospital.intro}</Descriptions.Item>
  </Descriptions>




  <Descriptions title="预约规则信息" column={2} layout="horizontal" bordered>
    <Descriptions.Item label="预约周期" > {hospital.bookingRule.cycle}天</Descriptions.Item>
    <Descriptions.Item label="放号时间" > {hospital.bookingRule.releaseTime}</Descriptions.Item>
    <Descriptions.Item label="停挂时间">{hospital.bookingRule.stopTime}</Descriptions.Item>
    <Descriptions.Item label="退号时间" > {hospital.bookingRule.quitTime}</Descriptions.Item>
    <Descriptions.Item label="预约规则" span={2} >{
        hospital.bookingRule.rule.map((item,index)=>{
          return  <h4 style={{}} >{index+1+","+item}<br/></h4>
        })


    }</Descriptions.Item>
  </Descriptions>

<div style={{marginTop:20,marginLeft:"45%"}}>
<Button type="primary" shape="round"   onClick={() => {
          navigate(-1)
        }} >
        返回
      </Button>
</div>
  
  </Card>
    



)
 
  
  
              
  
} 
